import React, {useEffect, useState} from 'react';

export default () => {
  const [count, setCount] = useState(0);

  /** 如果你想指定其调用次数,可以这样写(或则其它情况是一样的，deps里的每一项都可以是一个表达式)*/
  useEffect(() => {
    // 或则判断你可以写在这里(useEffect里),但这样效率显然没有在deps里写高
    // ,但deps里总是会多执行一次,如果是"次数"这样的还好控制
    // ,但如果表达式是这样 x==='str'?x:null,总是会多执行一次 （因为mounted时是必执行的）
    // 故可以在里面(这里)再进行一层过滤

    setTimeout(() => {
      setCount(x => x + 1);
    }, 1000);
  }, [count<3?count:undefined]); // 总共会调用四次

  /*useEffect(() => {
    setTimeout(() => {
      setCount(x => x + 1);
    }, 1000);
  }, [null]); //会触发两次 渲染的count分别为0，1*/

  console.log('render');

  return <div>
    <p>{count}</p>
  </div>
};
